// compents/test/test.js
// 导入behaviors
const myBehavior = require('../../behaviors/my-behaviors')
Component({
  // 挂载behaviors
  behaviors: [myBehavior],
  options: {
    // isolated 启用样式隔离 为默认值 apply-shared 页面可以单方面影响组件  shared页面组件可以互相影响
    styleIsolation: 'shared',
    pureDataPattern: /^_/
  },
  /**
   * 组件的属性列表
   */
  properties: {
    min: { //Number 类型 默认为10
      type: Number,
      value: 10,
    },
    // min: Number //Number 类型 默认为空
    count: Number
  },

  /**
   * 组件的初始数据
   */
  data: {
    count1: 0,
    n1: 0,
    n2: 0,
    sum: 0,
    _rgb: {
      r: 0,
      g: 0,
      b: 0
    },
    fullColor: '0,0,0'
  },

  /**
   * 组件的方法列表
   */
  methods: { //组件的方法列表 包含事件处理的函数和自定义方法
    addCount() {
      // if (this.data.count1 >= this.properties.min) return
      this.setData({
        count: this.data.count + 1
      })
      this.triggerEvent('sync', {
        value: this.properties.count
      })
      this._showCount()
    },
    _showCount() { //建议以 _ 开头
      wx.showToast({
        title: 'count的值为' + this.data.count,
        icon: 'none'
      })
    },
    addN1() {
      this.setData({
        n1: this.data.n1 + 1
      })
    },
    addN2() {
      this.setData({
        n2: this.data.n2 + 1
      })
    },
    RClick() {
      this.setData({
        '_rgb.r': this.data._rgb.r + 10 >= 255 ? 255 : this.data._rgb.r + 10
      })
    },
    GClick() {
      this.setData({
        '_rgb.g': this.data._rgb.g + 10 >= 255 ? 255 : this.data._rgb.g + 10
      })
    },
    BClick() {
      this.setData({
        '_rgb.b': this.data._rgb.b + 10 >= 255 ? 255 : this.data._rgb.b + 10
      })
    },
    _randomColor() {
      this.setData({
        _rgb: {
          r: Math.floor(Math.random() * 256),
          g: Math.floor(Math.random() * 256),
          b: Math.floor(Math.random() * 256)
        }
      })
    }

  },
  // 数据监听
  observers: {
    'n1,n2': function (n1, n2) { //监听n1 和 n2 的数据变化
      this.setData({
        sum: n1 + n2 // 通过数据监听 自动计算sum的值
      })
    },
    // '_rgb.r,_rgb.g,_rgb.b': function (r, g, b) { //监听n1 和 n2 的数据变化
    //   this.setData({
    //     // fullColor: r+','+g+','+b // 通过数据监听 自动计算sum的值
    //     fullColor: `${r},${g},${b}` // 通过数据监听 自动计算sum的值
    //   })
    // }
    '_rgb.**': function (obj) { //使用通配符**监听对象上所有属性的变化
      this.setData({
        fullColor: `${obj.r},${obj.g},${obj.b}` // 通过数据监听 自动计算sum的值
      })
    }
  },
  lifetimes: {
    created() {
      console.log('created~~~~~~~~~~');
    },
    attached() {
      console.log('attached~~~~~~~~~~');
    }
  },
  pageLifetimes: {
    show() {
      console.log('show');
      this._randomColor()
    },
    hide() {
      console.log('hide');
    },
    resize() {
      console.log('resize');
    }
  }
})